Using bean context of Seam only

This documentation is for an older version of ZK. For the latest one, please click here.

In Part 3, we not only replace the UI layer but also eliminate the navigation rule. Without tied with the navigation rule we can put all CRUD operation in just one page.

• part3/hello.zul

  <?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" ?>
  <?variable-resolver class="org.zkoss.seam.DelegatingVariableResolver"?>
  <zk  >
  <hbox onCreate="refreshW1()">
  <zscript>import org.zkoss.seam.*;import org.jboss.seam.*;</zscript>
  <zscript>
	Person selectedPerson;
  </zscript>
  <window border="normal" width="300px" id="w1">
	<textbox visible="false" value="@{bind(value=person.id,save-when='triggerBtn.onClick'}"/>
	<grid>
	  <rows>
		<row>Your Name: 
		<textbox onBindingSave="ValidationUtil.validate(event)"
		value="@{bind(value=person.name,save-when='triggerBtn.onClick')}"/></row>
		....
	  </rows>
	</grid>
	<button label="Say Hello" id="btn" onClick="Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn));doSayHello()" />
	<button label="Update" id="updateBtn" onClick="Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn));doUpdate()" />
	<button label="Delete" id="deleteBtn" onClick="Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn));doDelete()" />
	<button label="Cancel" id="cancelBtn" onClick="doClear()"/>
	<button visible="false" id="triggerBtn" onBindingValidate="ValidationUtil.afterValidate(event)"/>
  </window>
  <window title="The following persons have said 'hello' to Zk and Seam:" border="normal" width="550px" id="w2">
	<listbox id="g1" onSelect="listSelected(g1.selectedItem)"
	  model="@{bind(fans)}" selectedItem="@{bind(selectedPerson)}">
	  ....
	  <listitem self="@{bind(each='lperson')}">
		<listcell label="@{bind(lperson.name)}"/>
		....
	  </listitem>
	</listbox>
  </window>
  <zscript>
	void listSelected(li){
	  ContextUtil.updateToContext("person",selectedPerson);
	  binder.loadComponent(w1);
	  refreshW1();
	}
	void doSayHello(){
	  manager.sayHello();
	  binder.loadComponent(w2);
	  doClear();
	}
	void doUpdate(){
	  manager.update();
	  binder.loadComponent(w2);
	  doClear();
	}
	void doDelete(){
	  if(DataModelUtil.select("fans","selectedFan",person)){
		manager.delete();
		binder.loadComponent(w2);  
		doClear();
	  }else{
		alert("some thing wrong!!");
	  }
	}
	void doClear(){
	  ContextUtil.updateToContext("person",new Person());
	  selectedPerson = null;
	  binder.loadComponent(w1);
	  refreshW1();
	}
	void refreshW1(){
	  if(person.id==0){
		w1.getFellow("btn").setVisible(true);
		....
	  }else{
		w1.getFellow("btn").setVisible(false);
		....
	  }
	}
  </zscript>
  </hbox>
  </zk>

1. We use a tirggerBtn to proxy save-when event to multiple buttons(btn, updateBtn and deleteBtn). And those buttons must send a onClick Event to tirggerBtn to notify Data Binding to process.
2. When listSelected(), we put selectedPerson into to Seam's context by ContextUtil.updateToContext(name:String,bean:Object). After that, we can reload the window by Data Binding.
3. When "Say Hello" button is clicked, Data Binding is triggered by the Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn)) and will bind data into person which is obtained from Seam's context. After that, doSayHello() just call manager.sayHello() to insert data
4. When "Update" button is clicked, Data Binding is triggered by the Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn)) and will bind data into person which is obtained from Seam's context. After that, doUpdate() just call manager.update() to update data.
5. When "Delete" button is clicked, Data Binding is triggered by the Events.sendEvent(new Event(Events.ON_CLICK,triggerBtn)) and will bind data into person which is obtained from Seam's context. After that, in doDelete() we use DataModelUtil.select(dataModel:String,dataModelSelection:String,selected:Object) to inject person into Seam's context for DataModelSelection, and then just call manager.delete() to delete data.
6. When doClear(), we put a new Person() into to Seam's context by ContextUtil.updateToContext(name:String,bean:Object). After that, We can reload the window by Data Binding.

Live Demo

ERROR: Width and Height not set